<template>
	<view>
		<uni-search-bar placeholder="请输入您想搜索资源" @confirm="search" :focus="false" v-model="searchValue" @input="input" @clear="clear">
		</uni-search-bar>
		<uni-grid :column="4" :highlight="true" :show-border="false" @change="change">
			<uni-grid-item v-for="(item, index) in allItems" :index="index" :key="index" @click="openPage(item)">
				<view class="grid-item-box">
					<uni-icons custom-prefix="iconfont" :type="'icon-uds-'+item.name" size="30"></uni-icons>
					<text class="text">{{item.text}}</text>
				</view>
			</uni-grid-item>
		</uni-grid>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				allItems:[
					{text:'控制器',url:'/pages/home/controller',name:'application'},
				],
				searchValue: ''
			}
		},
		methods: {
			search(res) {
				uni.showToast({
					title: '搜索：' + res.value,
					icon: 'none'
				})
			},
			input(res) {
				console.log('----input:', res)
			},
			clear(res) {
				uni.showToast({
					title: 'clear事件，清除值为：' + res.value,
					icon: 'none'
				})
			},
 
			openPage(item){
				console.log('###item,',item);
				uni.navigateTo({
					url:item.url
				})
			}
		}
	}
</script>

<style lang="scss">
	@import "@/static/icons/uds/iconfont.css";
	
	.grid-item-box {
		flex: 1;
		// position: relative;
		/* #ifndef APP-NVUE */
		display: flex;
		/* #endif */
		flex-direction: column;
		align-items: center;
		justify-content: center;
		padding: 15px 0;
	}
</style>
